Component({
  pageLifetimes: {

      //页面展示
      show() {
        this.getServerData("接单额");
      },
      //页面隐藏
      hide() {
      
      }
  },


  data: {

  
    buttons: [
      { id: 1, name: '当日',checked:true }, 
      { id: 2, name: '当月',checked:false }
    ],

    button2: [
      { id: 1, name: '接单额',checked:true }, 
      { id: 2, name: '接单平方',checked:false }, 
      { id: 3, name: '接单达标率',checked:false }, 
      { id: 4, name: '出货额',checked:false }, 
      { id: 5, name: '出货平方',checked:false }, 
      { id: 6, name: '出货达标率',checked:false }, 
      { id: 7, name: '投诉率',checked:false },
      { id: 8, name: '退货率',checked:false },
    ],

    tableHeader: [
      {
        prop: 'sale_name',
        width: 170,
        label: '销售单位',
        color: 'blue'
      },
      {
        prop: 'accept_money',
        width: 140,
        label: '接单额'
      },
      {
        prop: 'accept_m',
        width: 150,
        label: '接单平方'
      },
      {
        prop: 'target_money',
        width: 140,
        label: '目标额'
      },
      {
        prop: 'OK_rate',
        width: 140,
        label: '达标率'
      }
    ],
    stripe: true,
    border: true,
    outBorder: true,
    row: [
      {
        "id": 1,
        "sale_name": "业务一部",
        "accept_money": 100,
        "accept_m": 50,
        "target_money": 800,
        "OK_rate": 0.5,
          
      }, 
      
    ],
    
    // ec: {
    //   onInit: initChart
    // }
    chartData: {},
  //这里的 opts 是图表类型 type="line" 的全部配置参数，您可以将此配置复制到 config-ucharts.js 文件中下标为 ['line'] 的节点中来覆盖全局默认参数。实际应用过程中 opts 只需传入与全局默认参数中不一致的【某一个属性】即可实现同类型的图表显示不同的样式，达到页面简洁的需求。
    opts: {
      timing: "easeOut",
      duration: 1000,
      rotate: false,
      rotateLock: false,
      color: ["#1890FF","#91CB74","#FAC858","#EE6666","#73C0DE","#3CA272","#FC8452","#9A60B4","#ea7ccc"],
      padding: [15,10,0,15],
      fontSize: 13,
      fontColor: "#666666",
      dataLabel: true,
      dataPointShape: true,
      dataPointShapeType: "solid",
      touchMoveLimit: 60,
      enableScroll: false,
      enableMarkLine: false,
      legend: {
        show: true,
        position: "bottom",
        float: "center",
        padding: 5,
        margin: 5,
        backgroundColor: "rgba(0,0,0,0)",
        borderColor: "rgba(0,0,0,0)",
        borderWidth: 0,
        fontSize: 13,
        fontColor: "#666666",
        lineHeight: 11,
        hiddenColor: "#CECECE",
        itemGap: 10
      },
      xAxis: {
        disableGrid: true,
        disabled: false,
        axisLine: true,
        axisLineColor: "#CCCCCC",
        calibration: false,
        fontColor: "#666666",
        fontSize: 13,
        lineHeight: 20,
        marginTop: 0,
        rotateLabel: false,
        rotateAngle: 45,
        itemCount: 5,
        boundaryGap: "center",
        splitNumber: 5,
        gridColor: "#CCCCCC",
        gridType: "solid",
        dashLength: 4,
        gridEval: 1,
        scrollShow: false,
        scrollAlign: "left",
        scrollColor: "#A6A6A6",
        scrollBackgroundColor: "#EFEBEF",
        title: "",
        titleFontSize: 13,
        titleOffsetY: 0,
        titleOffsetX: 0,
        titleFontColor: "#666666",
        format: ""
      },
      yAxis: {
        gridType: "solid",
        dashLength: 2,
        disabled: false,
        disableGrid: false,
        splitNumber: 5,
        gridColor: "#CCCCCC",
        padding: 10,
        showTitle: false,
        data: [
          {
            min: 0,
            max: 300,
          }
        ]
      },
      extra: {
        line: {
          type: "straight",
          width: 2,
          activeType: "hollow",
          linearType: "none",
          onShadow: false,
          animation: "vertical"
        },
        tooltip: {
          showBox: true,
          showArrow: true,
          showCategory: false,
          borderWidth: 0,
          borderRadius: 0,
          borderColor: "#000000",
          borderOpacity: 0.7,
          bgColor: "#000000",
          bgOpacity: 0.7,
          gridType: "solid",
          dashLength: 4,
          gridColor: "#CCCCCC",
          boxPadding: 3,
          fontSize: 13,
          lineHeight: 20,
          fontColor: "#FFFFFF",
          legendShow: true,
          legendShape: "auto",
          splitLine: true,
          horizentalLine: false,
          xAxisLabel: false,
          yAxisLabel: false,
          labelBgColor: "#FFFFFF",
          labelBgOpacity: 0.7,
          labelFontColor: "#666666"
        },
        markLine: {
          type: "solid",
          dashLength: 4,
          data: []
        }
      }
    }
  },
  

  methods: {

    /**
     * 生命周期函数--监听页面加载
     */
    onLoad: function () {
      wx.setNavigationBarTitle({
        title: '销售'
      })
      this.data.buttons[5].checked=true;
      this.setData({
        buttons: this.data.buttons,
      })
    },
    radioButtonTap: function (e) {
      console.log(e)
      let id = e.currentTarget.dataset.id
      console.log(id)
      for (let i = 0; i < this.data.row.length; i++) {
        this.data.row[i].status=id
      }
      for (let i = 0; i < this.data.buttons.length; i++) {
        if (this.data.buttons[i].id == id) {
          //当前点击的位置为true即选中
          this.data.buttons[i].checked = true;
        }
        else {
          //其他的位置为false
          this.data.buttons[i].checked = false;
        }
      }
      this.setData({
        buttons: this.data.buttons,
        
      })
      this.setData({
        row:this.data.row,
      })
      
    },

    
    radioButtonTap2: function (e) {
      let id = e.currentTarget.dataset.id
      for (let i = 0; i < this.data.button2.length; i++) {
        if (this.data.button2[i].id == id) {
          //当前点击的位置为true即选中
          this.data.button2[i].checked = true;
          this.getServerData(this.data.button2[i].name)
        }
        else {
          //其他的位置为false
          this.data.button2[i].checked = false;
        }
      }
      this.setData({
        button2: this.data.button2,
        
      })
      
    },

    /**
     * 生命周期函数--监听页面初次渲染完成
     */
    onReady:function() {
      
    },
      
    getServerData(name) {
      //模拟从服务器获取数据时的延时
      setTimeout(() => {
        let cate = ["01","02","03","04","05","06","07","08","09","10","11","12"]
        //模拟服务器返回数据，如果数据格式和标准格式不同，需自行按下面的格式拼接
        let res = {
            categories: cate,
            series: [
              // {
              //   name: "成交量A",
              //   data: [35,8,25,37,4,20]
              // },
              // {
              //   name: "成交量B",
              //   data: [70,40,65,100,44,68]
              // },
              {
                name: name,
                data: [100,80,95,200,112,132]
              }
            ]
          };
        this.setData({ chartData: JSON.parse(JSON.stringify(res)) });
      }, 500);
    },
    /**
     * 生命周期函数--监听页面显示
     */
    onShow:function() {

    },

    /**
     * 生命周期函数--监听页面隐藏
     */
    onHide:function() {
      
    },
 
  },

    
})

